
<ion-header>
  <ion-navbar style="background-color: white">
    <ion-title>定时</ion-title>
  </ion-navbar>
</ion-header>

<ion-content  text-center style="padding: 0;background-color: #F0F0F0">
  <div style="display: flex;align-items: center;background-color: white">
    <div  style="flex: 1" (click)="timing_switch(true)" [class.is-device]="!is_device">
      <span class="timing-option">设备定时</span>
    </div>
    <div style="flex: 1" (click)="timing_switch(false)" [class.is-device]="is_device">
      <span  class="timing-option" >场景定时</span>
    </div>
  </div>

  <div *ngIf="is_device">
    <ion-card class="timing-card" *ngFor="let device_card of device_list">
      <ion-card-content class="timing-card-content">
        <div style="display: flex;align-items: center">
          <div style="flex: 2">
            <img src="../../assets/imgs/timer_icon_clock@2x.png" alt="">
          </div>
          <div style="flex: 1"></div>
          <div style="flex: 6;text-align: left">
            <p class="timing-time">10:00</p>
            <p class="timing-device">{{device_card}}<span class="timing-room">一楼客厅</span> </p>
          </div>
          <div style="flex: 2">

          </div>
          <div style="flex: 6">
            <ion-item>
              <ion-label style="font-size: 14px;margin: 0">每天</ion-label>
              <ion-toggle  color="energized"  checked="true"></ion-toggle>
            </ion-item>
          </div>

        </div>
      </ion-card-content>
    </ion-card>
  </div>
  <div *ngIf="!is_device">

  </div>
</ion-content>
